<template>
	<div>
		<el-dialog
			:title="title"
			:visible.sync="dialogVisible"
			width="70%"
			:before-close="dialogClick"
			@open="initData"
		>
			<!-- <div @click="print">导出</div> -->

			<div
				class="dialogBox"
				v-loading="loadings"
				element-loading-text="拼命导出中"
				element-loading-spinner="el-icon-loading"
				element-loading-background="rgba(0, 0, 0, 0.8)"
			>
			<v-OutPdf @exportPdf="initPdfData" ></v-OutPdf>
				<div class="box" ref="box">
					<div class="menu">
						<header
							style="display:grid;justify-content:center;align-content:center"
						>
							<p style="font-size:30px">目&nbsp;&nbsp;&nbsp;录</p>
						</header>
						<main
							style="width:80%;display:grid;justify-items:center"
						>
							<div style="width:70%;">
								<span
									style="display:grid;margin-bottom:10px;font-weight: 600;font-size: 18px;"
									>oracle数据库智能运行报告</span
								>
							</div>

							<div style="width:70%;">
								<a href="#one-jczj">
									<span
										style="font-size: 16px;font-weight:600"
										>&nbsp;&nbsp;&nbsp;&nbsp;一.检查总结</span
									>
								</a>
								<div style="display:grid;padding-left:32px">
									<a href="#one-gy"> <span>1.概要</span></a>
									<a href="#one-ztgk"
										><span>2.总体概况</span></a
									>
									<a href="one-yhjy">
										<span>3.优化建议</span></a
									>
								</div>
							</div>

							<div style="width:70%;">
								<a href="#two-js">
									<span
										style="font-size: 16px;font-weight:600"
										>&nbsp;&nbsp;&nbsp;&nbsp;二．介绍</span
									>
								</a>
								<div style="display:grid;padding-left:32px">
									<a href="#two-mb">
										<span>1.目标</span>
									</a>
									<a href="#two-jcff">
										<span>2.检查方法</span></a
									>
									<a href="#two-jcfw">
										<span>3.检查范围</span>
									</a>
								</div>
							</div>

							<div style="width:70%;">
								<a href="#three-pzfx">
									<span
										style="font-size: 16px;font-weight:600"
										>&nbsp;&nbsp;&nbsp;&nbsp;三．数据库配置分析</span
									>
								</a>
								<div style="display:grid;padding-left:32px">
									<a href="#three-yjpz">
										<span>1.硬件配置</span>
									</a>
									<a href="#three-rjpz">
										<span>2.软件配置</span>
									</a>
									<a href="#three-sjkcs">
										<span>3.数据库参数</span>
									</a>
									<a href="#three-kzwj">
										<span>4.控制文件</span>
									</a>
									<a href="#three-lsbkj">
										<span>5.临时表空间</span></a
									>
									<a href="#three-bkjgl">
										<span>6.表空间管理</span></a
									>
									<a href="#three-hgd">
										<span>7.回滚段</span></a
									>
									<a href="#three-wxdx">
										<span
											>8.无效对象，约束和trigger</span
										></a
									>
									<a href="#three-sjkrz">
										<span
											>9.数据库日志ALTER LOG分析</span
										></a
									>
								</div>
							</div>

							<div style="width:70%;">
								<a href="#four-xnfx">
								<span style="font-size: 16px;font-weight:600"
									>&nbsp;&nbsp;&nbsp;&nbsp;四．数据库性能分析</span
								></a>
								<div style="display:grid;padding-left:32px">
									<a href="#four-sjk">
									<span>1.数据库实例性能命中率</span></a>
									
									<a href="#four-ddsj">
									<span>2.等待事件(Top Wait Events)</span></a>
								</div>
							</div>
						</main>
					</div>

					<div
						class="info-box"
						style="display:grid;justify-items: center;margin-top:10px ;"
					>
						<div class="tip1" style="width:80%;">
							<header
								style="display:grid;grid-template-rows: 30px 5px ;"
							>
								<div style="" id="one-jczj">
									<span
										style="
								background: #363636;height:100%;
								font-size:18px;
								font-weight:500;
								padding:8px 8px;
								color: #FFFAFA;
								border-top-left-radius: 5px;
								border-top-right-radius: 5px;
								"
										>一.检查总结</span
									>
								</div>
								<div style="background:#363636;"></div>
							</header>
							<div id="one-gy" style="margin:20px">
								<p style="font-size:16px;font-weight: 600;">
									1.概要
								</p>
								<p style="text-indent: 2em;">
									此次巡检主要针对oracle数据库进行一次全面的健康检查，包括数据库配置、数据库性能等各项内容，并依照此次检查结果，提出相应的优化措施。
								</p>
							</div>
							<div id="one-ztgk" style="margin:20px">
								<p style="font-size:16px;font-weight: 600;">
									2.总体概况
								</p>
								<p
									style="text-indent: 2em;margin-bottom:10px ;"
								>
									以下是本次检查的总结
								</p>
								<div style="">
									<table
										border="1"
										style="border-collapse:collapse;width:100%"
									>
										<tr>
											<th
												style="width:30%;background: #9BBB59"
											>
												检查方面
											</th>
											<th
												style="width:70%;background: #9BBB59"
											>
												评价/发现情况
											</th>
										</tr>
										<tr>
											<th style="display:grid">
												数据库配置能
											</th>
											<th>配置正常</th>
										</tr>
										<tr>
											<th>数据库性能</th>
											<th>性能良好</th>
										</tr>
									</table>
								</div>
							</div>

							<div id="one-yhjy" style="margin:20px">
								<p style="font-size:16px;font-weight: 600;">
									3.优化建议
								</p>
								<p
									style="text-indent: 2em;margin-bottom:10px ;"
								>
									以下是对检查的结果进行分析后所得出的优化建议
								</p>
								<div style="">
									<table
										border="1"
										style="border-collapse:collapse;width:100%"
									>
										<tr>
											<th
												style="width:10%;background: #9BBB59"
											>
												No.
											</th>
											<th
												style="width:70%;background: #9BBB59"
											>
												问题描述
											</th>
											<th
												style="width:70%;background: #9BBB59"
											>
												优先级
											</th>
										</tr>
										<tr>
											<th>1</th>
											<th>
												数据库为非归档模式，存在安全隐患
											</th>
											<th>中</th>
										</tr>
										<tr>
											<th>2</th>
											<th>
												回滚表空间使用率较高，建议增加表空间大小
											</th>
											<th>中</th>
										</tr>
									</table>
								</div>
							</div>
						</div>

						<div class="tip2" style="width:80%;">
							<header
								style="display:grid;grid-template-rows: 30px 5px ;"
							>
								<div id="two-js" style="">
									<span
										style="
								background: #363636;height:100%;
								font-size:18px;
								font-weight:500;
								padding:8px 8px;
								color: #FFFAFA;
								border-top-left-radius: 5px;
								border-top-right-radius: 5px;
								"
										>二．介绍</span
									>
								</div>
								<div style="background:#363636;"></div>
							</header>
							<div id="two-mb" style="margin:20px">
								<p style="font-size:16px;font-weight: 600;">
									1.目标
								</p>
								<p style="text-indent: 2em;">
									数据库健康检查是用来：
								</p>
								<ul style="list-style: none;margin-left:45px ;">
									<li type="i" style="font-size:12px">
										评价数据库当前的性能情况
									</li>
									<li type="i" style="font-size:12px">
										分析数据库应用瓶颈和资源竞争情况
									</li>
									<li type="i" style="font-size:12px">
										指出存在的问题，提出解决建议
									</li>
								</ul>
							</div>
							<div id="two-jcff" style="margin:20px">
								<p style="font-size:16px;font-weight: 600;">
									2.检查方法
								</p>
								<p
									style="text-indent: 2em;margin-bottom:10px ;"
								>
									本次数据库性能检查的工具是：
								</p>
								<p style="margin-left:45px ;">
									<span
										class="width:5px;height:5px;background: #b5b5b5;"
										>&bull;</span
									>
									IT智能管理系统。
								</p>
								<p style="margin-left:50px ;">
									上述输出结果为建议提供依据。
								</p>
							</div>

							<div id="two-jcfw" style="margin:20px">
								<p style="font-size:16px;font-weight: 600;">
									3.检查范围
								</p>
								<p
									style="text-indent: 2em;margin-bottom:10px ;"
								>
									本报告提供的检查和建议主要针对以下方面：
								</p>
								<p style="margin-left:50px">1.数据库配置</p>
								<p style="margin-left:50px">2.数据库性能</p>
								<p style="margin-left:30px">
									本报告的提供的检查和建议不涉及：
								</p>
								<ul style="margin-left:50px">
									<li type="i">具体的性能调整</li>
									<li type="i">应用程序的具体细节</li>
								</ul>
								<p style="text-indent: 2em;">
									以下提请注意：本次检查仅历时半天。所以在具体的性能方面仅做相应的建议。如需在数据库性能方面进行进一步的调整，请继续选择数据库性能调整。
								</p>
							</div>
						</div>

						<div class="tip3" style="width:80%;">
							<header
								style="display:grid;grid-template-rows: 30px 5px ;"
							>
								<div style="" id="three-pzfx">
									<span
										style="
								background: #363636;height:100%;
								font-size:18px;
								font-weight:500;
								padding:8px 8px;
								color: #FFFAFA;
								border-top-left-radius: 5px;
								border-top-right-radius: 5px;
								"
										>三．数据库配置分析</span
									>
								</div>
								<div style="background:#363636;"></div>
							</header>
							<div id="three-yjpz" style="margin:20px">
								<p style="font-size:16px;font-weight: 600;">
									1.硬件配置
								</p>
								<table
									border="1"
									style="border-collapse:collapse;width:100%"
								>
									<tr>
										<th
											style="width:30%;background: #9BBB59"
										>
											name
										</th>
										<th
											style="width:70%;background: #9BBB59"
										>
											value
										</th>
									</tr>
									<tr>
										<th style="display:grid">主机名</th>
										<th>Hissrv1</th>
									</tr>
									<tr>
										<th>ip</th>
										<th>Prod</th>
									</tr>
									<tr>
										<th>操作系统</th>
										<th>AIX 6100-01</th>
									</tr>
									<tr>
										<th>内存</th>
										<th>16G</th>
									</tr>
									<tr>
										<th>cpu</th>
										<th>32</th>
									</tr>
									<tr>
										<th>ORACLE模式</th>
										<th>单机/RAC</th>
									</tr>
								</table>
							</div>
							<div id="three-rjpz" style="margin:20px">
								<p style="font-size:16px;font-weight: 600;">
									2.软件配置
								</p>
								<table
									border="1"
									style="border-collapse:collapse;width:100%"
								>
									<tr>
										<th
											style="width:30%;background: #9BBB59"
										>
											实例名
										</th>
										<th
											style="width:70%;background: #9BBB59"
										>
											Orcl
										</th>
									</tr>
									<tr>
										<th style="display:grid">
											数据库版本
										</th>
										<th>11.2.0.4</th>
									</tr>
									<tr>
										<th>SGA size</th>
										<th>40G</th>
									</tr>
									<tr>
										<th>PGA size</th>
										<th>2G</th>
									</tr>
									<tr>
										<th>表空间个数</th>
										<th>6</th>
									</tr>
									<tr>
										<th>数据文件个数</th>
										<th>82</th>
									</tr>
									<tr>
										<th>控制文件个数</th>
										<th>3</th>
									</tr>
									<tr>
										<th>归档方式</th>
										<th>非归档模式</th>
									</tr>
								</table>

								<p>
									结论：数据库为非归档模式，存在安全隐患/（正常）
								</p>
							</div>

							<div id="three-sjkcs" style="margin:20px">
								<p style="font-size:16px;font-weight: 600;">
									3.数据库参数
								</p>
								<table
									border="1"
									style="border-collapse:collapse;width:100%"
								>
									<tr>
										<th
											style="width:30%;background: #9BBB59"
										>
											Parameter Name
										</th>
										<th
											style="width:70%;background: #9BBB59"
										>
											Begin value
										</th>
									</tr>
									<tr>
										<th style="display:grid">
											kgl_large_heap_warning_threshold
										</th>
										<th>22428800</th>
									</tr>
									<tr>
										<th>audit_file_dest</th>
										<th>
											/usr/users/oracle/product/10.2.0/admin/orcl/adump
										</th>
									</tr>
									<tr>
										<th>background_dump_dest</th>
										<th>
											/usr/users/oracle/product/10.2.0/admin/orcl/bdump
										</th>
									</tr>
									<tr>
										<th>compatible</th>
										<th>10.2.0.1.0</th>
									</tr>
									<tr>
										<th>control_files</th>
										<th>
											/usr/users/oracle/oradata/orcl/control01.ctl,
											/usr/users/oracle/oradata/orcl/control02.ctl,
											/usr/users/oracle/oradata/orcl/control03.ctl
										</th>
									</tr>
									<tr>
										<th>cursor_sharing</th>
										<th>FORCE</th>
									</tr>
									<tr>
										<th>db_block_size</th>
										<th>8192</th>
									</tr>
									<tr>
										<th>db_domain</th>
										<th></th>
									</tr>
									<tr>
										<th>db_file_multiblock_read_count</th>
										<th>orcl</th>
									</tr>
									<tr>
										<th>db_recovery_file_dest</th>
										<th>
											/usr/users/oracle/product/10.2.0/flash_recovery_area
										</th>
									</tr>
									<tr>
										<th>db_recovery_file_dest_size</th>
										<th>2147483648</th>
									</tr>
									<tr>
										<th>filesystemio_options</th>
										<th>SETALL</th>
									</tr>
									<tr>
										<th>job_queue_processes</th>
										<th>10</th>
									</tr>
									<tr>
										<th>nls_language</th>
										<th>SIMPLIFIED CHINESE</th>
									</tr>
									<tr>
										<th>nls_territory</th>
										<th>CHINA</th>
									</tr>
									<tr>
										<th>open_cursors</th>
										<th>300</th>
									</tr>
									<tr>
										<th>pga_aggregate_target</th>
										<th>1600126976</th>
									</tr>
									<tr>
										<th>processes</th>
										<th>150</th>
									</tr>
									<tr>
										<th>pga_aggregate_target</th>
										<th>1600126976</th>
									</tr>
									<tr>
										<th>remote_login_passwordfile</th>
										<th>EXCLUSIVE</th>
									</tr>
									<tr>
										<th>sga_target</th>
										<th>4815</th>
									</tr>
									<tr>
										<th>sort_area_size</th>
										<th>1600126976</th>
									</tr>
									<tr>
										<th>undo_management</th>
										<th>AUTO</th>
									</tr>
									<tr>
										<th>undo_retention</th>
										<th>1600126976</th>
									</tr>
									<tr>
										<th>UNDOTBS1</th>
										<th>1600126976</th>
									</tr>
									<tr>
										<th>user_dump_dest</th>
										<th>
											/usr/users/oracle/product/10.2.0/admin/orcl/udump
										</th>
									</tr>
								</table>
							</div>
							<div id="three-kzwj" style="margin:20px">
								<p style="font-size:16px;font-weight: 600;">
									4.控制文件
								</p>
								<table
									border="1"
									style="border-collapse:collapse;width:100%"
								>
									<tr>
										<th
											style="width:30%;background: #9BBB59"
										>
											name
										</th>
										<th
											style="width:70%;background: #9BBB59"
										>
											value
										</th>
									</tr>
									<tr>
										<th style="display:grid">
											/usr/users/oracle/oradata/orcl/control01.ctl,
										</th>
										<th>null value</th>
									</tr>
									<tr>
										<th style="display:grid">
											/usr/users/oracle/oradata/orcl/control01.ctl,
										</th>
										<th>null value</th>
									</tr>
									<tr>
										<th style="display:grid">
											/usr/users/oracle/oradata/orcl/control01.ctl,
										</th>
										<th>null value</th>
									</tr>
								</table>
							</div>
							<div id="three-lsbkj" style="margin:20px">
								<p style="font-size:16px;font-weight: 600;">
									5.临时表空间
								</p>
								<p style="text-indent: 2em;">
									临时表空间用于存放临时段。为了维护数据库的性能，临时表空间的维护方法有别于其他一般表空间。缺省情况下，所有表空间都创建为PERMANENT。所以在创建临时段时，需要保证表空间类型为TEMPORARY。由于这些表空间中的排序段不被清除，所以减少了空间事务争夺，同时减少了SMON对于CPU的使用率
								</p>
								<p style="text-indent: 2em;">
									以下是数据库临时表空间的情况
								</p>
								<table
									border="1"
									style="border-collapse:collapse;width:100%"
								>
									<tr>
										<th
											style="width:14%;background: #9BBB59"
										>
											Status
										</th>
										<th
											style="width:14%;background: #9BBB59"
										>
											name
										</th>
										<th
											style="width:14%;background: #9BBB59"
										>
											Size (GB)
										</th>
										<th
											style="width:14%;background: #9BBB59"
										>
											Minimum Extents
										</th>
										<th
											style="width:14%;background: #9BBB59"
										>
											Maximum Extents
										</th>
										<th
											style="width:14%;background: #9BBB59"
										>
											Minimum Extent Length
										</th>
										<th
											style="width:14%;background: #9BBB59"
										>
											Increase (%)
										</th>
									</tr>
									<tr>
										<th>ONLINE</th>
										<th>TEMP_DATA</th>
										<th>30</th>
										<th>1</th>
										<th>Null value</th>
										<th>1,048,576</th>
										<th>0</th>
									</tr>
								</table>
							</div>
							<div id="three-bkjgl" style="margin:20px">
								<p style="font-size:16px;font-weight: 600;">
									6.表空间管理
								</p>
								<table
									border="1"
									style="border-collapse:collapse;width:100%"
								>
									<tr>
										<th
											style="width:25%;background: #9BBB59"
										>
											表空间名
										</th>
										<th
											style="width:25%;background: #9BBB59"
										>
											总容量（G）
										</th>
										<th
											style="width:25%;background: #9BBB59"
										>
											剩余空间（G）
										</th>
										<th
											style="width:25%;background: #9BBB59"
										>
											使用率%
										</th>
									</tr>
									<tr>
										<th>HIS_DATA</th>
										<th>728.52</th>
										<th>88.96</th>
										<th>87.79</th>
									</tr>
									<tr>
										<th>SYSAUX</th>
										<th>728.52</th>
										<th>88.96</th>
										<th>87.79</th>
									</tr>
								</table>

								<p style="text-indent: 2em;">
									结论：HIS_DATA
									表空间使用率超过85%，建议扩容。
								</p>
							</div>
							<div id="three-hgd" style="margin:20px">
								<p style="font-size:16px;font-weight: 600;">
									7.回滚段
								</p>
								<p style="text-indent: 2em;">
									回滚段能够用来保证读一致性，回滚事务以及恢复数据库。以下数据库中回滚段的使用情况：
								</p>
								<table
									border="1"
									style="border-collapse:collapse;width:100%"
								>
									<tr>
										<th
											style="width:16%;background: #9BBB59"
										>
											Status
										</th>
										<th
											style="width:16%;background: #9BBB59"
										>
											Name
										</th>
										<th
											style="width:16%;background: #9BBB59"
										>
											Size (GB)
										</th>
										<th
											style="width:16%;background: #9BBB59"
										>
											FREE(GB)
										</th>
										<th
											style="width:16%;background: #9BBB59"
										>
											USED(GB)
										</th>
										<th
											style="width:16%;background: #9BBB59"
										>
											USED_PERCENT
										</th>
									</tr>
									<tr>
										<th>HIS_DATA</th>
										<th>728.52</th>
										<th>88.96</th>
										<th>87.79</th>
										<th>88.96</th>
										<th>87.79</th>
									</tr>
								</table>

								<p style="text-indent: 2em;">
									结论：回滚段使用率较高，默认UNDO表空间为UNDOTBS1，建议扩容。
								</p>
							</div>
							<div id="three-wxdx" style="margin:20px">
								<p style="font-size:16px;font-weight: 600;">
									8.无效对象，约束和trigger
								</p>
								<p style="text-indent: 2em;">
									在数据库中，会存在一些无效的对象，导致这种现象的发生原因很多，其中最常见的就是数据库升级(例如修改了表的结构)，迁移而引起。
								</p>

								<p>结论：没有无效对象。</p>
							</div>
							<div id="three-sjkrz" style="margin:20px">
								<p style="font-size:16px;font-weight: 600;">
									9.数据库日志ALTER LOG分析
								</p>

								<p style="text-indent: 2em;">
									结论：检查alter日志，数据库近期无报错。
								</p>
							</div>
						</div>

						<div class="tip4" style="width:80%;">
							<header
								style="display:grid;grid-template-rows: 30px 5px ;"
							>
								<div style="" id="four-xnfx">
									<span
										style="
								background: #363636;height:100%;
								font-size:18px;
								font-weight:500;
								padding:8px 8px;
								color: #FFFAFA;
								border-top-left-radius: 5px;
								border-top-right-radius: 5px;
								"
										>四．数据库性能分析</span
									>
								</div>
								<div style="background:#363636;"></div>
							</header>
							<div id="four-sjk" style="margin:20px">
								<p style="font-size:16px;font-weight: 600;">
									1.数据库实例性能命中率
								</p>
								<p style="text-indent: 2em;">
									以下列出的是数据库实例性能的各项的命中率，它们的最佳值是100%
								</p>
								<table
									border="1"
									style="border-collapse:collapse;width:100%"
								>
									<tr>
										<th
											style="width:25%;background: #9BBB59"
										>
											Buffer Nowait %:
										</th>
										<th
											style="width:25%;background: #9BBB59"
										>
											100
										</th>
										<th
											style="width:25%;background: #9BBB59"
										>
											Redo NoWait %:
										</th>
										<th
											style="width:25%;background: #9BBB59"
										>
											100
										</th>
									</tr>
									<tr>
										<th
											style="width:25%;background: #9BBB59"
										>
											Buffer Hit %:
										</th>
										<th
											style="width:25%;background: #9BBB59"
										>
											100
										</th>
										<th
											style="width:25%;background: #9BBB59"
										>
											In-memory Sort %:
										</th>
										<th
											style="width:25%;background: #9BBB59"
										>
											100
										</th>
									</tr>
									<tr>
										<th
											style="width:25%;background: #9BBB59"
										>
											Library Hit %:
										</th>
										<th
											style="width:25%;background: #9BBB59"
										>
											100
										</th>
										<th
											style="width:25%;background: #9BBB59"
										>
											Soft Parse %:
										</th>
										<th
											style="width:25%;background: #9BBB59"
										>
											100
										</th>
									</tr>
									<tr>
										<th
											style="width:25%;background: #9BBB59"
										>
											Execute to Parse %:
										</th>
										<th
											style="width:25%;background: #9BBB59"
										>
											100
										</th>
										<th
											style="width:25%;background: #9BBB59"
										>
											Latch Hit %:
										</th>
										<th
											style="width:25%;background: #9BBB59"
										>
											100
										</th>
									</tr>
									<tr>
										<th
											style="width:25%;background: #9BBB59"
										>
											Parse CPU to Parse Elapsd %:
										</th>
										<th
											style="width:25%;background: #9BBB59"
										>
											100
										</th>
										<th
											style="width:25%;background: #9BBB59"
										>
											Non-Parse CPU:
										</th>
										<th
											style="width:25%;background: #9BBB59"
										>
											100
										</th>
									</tr>
								</table>

								<p style="text-indent: 2em;">
									结论：数据库命中率基本正常。
								</p>
							</div>
							<div id="four-ddsj" style="margin:20px">
								<p style="font-size:16px;font-weight: 600;">
									2.等待事件(Top Wait Events)
								</p>

								<p style="text-indent: 2em;">
									以下列出的数据库主要的等待事件
								</p>
								<table
									border="1"
									style="border-collapse:collapse;width:100%"
								>
									<tr>
										<th
											style="width:13%;background: #9BBB59"
										>
											Event
										</th>
										<th
											style="width:13%;background: #9BBB59"
										>
											Waits
										</th>
										<th
											style="width:13%;background: #9BBB59"
										>
											Time(s)
										</th>
										<th
											style="width:13%;background: #9BBB59"
										>
											Avg Wait(ms)
										</th>
										<th
											style="width:13%;background: #9BBB59"
										>
											Total Call Time
										</th>
										<th
											style="width:13%;background: #9BBB59"
										>
											Wait Class
										</th>
									</tr>
									<tr>
										<th>SQL*Net more data to client</th>
										<th>4096</th>
										<th>500</th>
										<th>0</th>
										<th>4.2</th>
										<th>System I/O</th>
									</tr>
									<tr>
										<th>CPU time</th>
										<th>4096</th>
										<th>500</th>
										<th>0</th>
										<th>4.2</th>
										<th>System I/O</th>
									</tr>
									<tr>
										<th>db file parallel write</th>
										<th>4096</th>
										<th>500</th>
										<th>0</th>
										<th>4.2</th>
										<th>System I/O</th>
									</tr>
									<tr>
										<th>log file parallel write</th>
										<th>4096</th>
										<th>500</th>
										<th>0</th>
										<th>4.2</th>
										<th>System I/O</th>
									</tr>
									<tr>
										<th>log file sync</th>
										<th>4096</th>
										<th>500</th>
										<th>0</th>
										<th>4.2</th>
										<th>System I/O</th>
									</tr>
								</table>

								<p style="text-indent: 2em;">
									结论：数据库存在应用锁情况，需要结合应用进行排查。
								</p>
							</div>
						</div>
					</div>
				</div>

				<!-- html to pdf -->
				<!-- <v-OutPdf
					@htmlData="initPdfData"
					:htmlData="dialogData"
				></v-OutPdf> -->
			</div>
			<span slot="footer" class="dialog-footer">
				<!-- <el-button @click="dialogClick">取 消</el-button> -->
				<el-button type="primary" @click="dialogClick">确 定</el-button>
			</span>
		</el-dialog>
	</div>
</template>
<script>
import bus from 'common/bus.js';
import vOutPdf from '@/components/common/outPdf/outPdf';
import { htmlToBlob } from '@/api/index';
// import {htmlToBlob} from '@/api/index'
import {
	selectosinfo,
	selectoscpu,
	selectosmemory,
	selectosfile,
} from '@/api/index';

export default {
	props: {
		dialogVisible: Boolean,
		itemType: String,
		dialogData: Array,
		title: String,
		info: null,
	},
	components: {
		vOutPdf,
	},
	created() {
		// console.log(dialogData);
		// this.initData()
	},
	data() {
		return {
			// dialogDatabaseItem: dialogDatabaseItem,
			// dialogServerItem: dialogServerItem,
			// dialogInternetItem: dialogInternetItem,
			pdfData: '',
			loadings: false,
			serverInfo: [],
			cpuInfo: '',
			osInfo: '',
			fileInfo: '',
			// info:this.info
		};
	},
	methods: {
		dialogClick() {
			this.$emit('haldDialogfalse');
		},

		initData() {
			selectosinfo(this.info)
				.then((res) => {
					// console.log(res, '服务器');
					this.serverInfo.push(res);
				})
				.catch((err) => {
					console.log(err);
				}),
				selectoscpu(this.info)
					.then((res) => {
						// console.log(res, 'cpu');
						this.cpuInfo = res;
					})
					.catch((err) => {
						console.log(err);
					}),
				selectosmemory(this.info)
					.then((res) => {
						// console.log(res, '内存');
						this.osInfo = res;
					})
					.catch((err) => {
						console.log(err);
					}),
				selectosfile(this.info)
					.then((res) => {
						// console.log(res, '文件系统');
						this.fileInfo = res;
					})
					.catch((err) => {
						console.log(err);
					});
		},
		// print(){
		// 	this.$PDFSave(this.$refs["content"], "我的文件");
		// },
		// exportPdf(){
		// 	this.pdfData=''
		// },
		initPdfData() {
			this.loadings = true;
			let data=this.$refs.box.innerHTML;
			let Ecmascript=`<script>let a =document.querySelectorAll('a');console.log(a);for(let i=0;i<a.length;i++)a[i].href=''<\/script>`;
			
			// console.log(data, 'html');
			// console.log(data, 'html');
			data = `<html><body><style>a {text-decoration: none;color:#363636;display:block}</style>${data}</body>${Ecmascript}</html>`;
			// console.log(data)
			htmlToBlob({ html: data })
				.then((res) => {
					// console.log(res);
					if (res.status === '200') {
						this.$message({
							showClose: true,
							message: '导出成功',
							type: 'success',
						});
					}

					const buf = Buffer.from(
						res.data._streams[1].data,
						'binary'
					);
					// 再输入到 Blob 生成文件
					const blob = new Blob([buf], { type: 'application/pdf' });
					const a = document.createElement('a');
					// 指定生成的文件名
					a.download = `${this.info}的${this.title}` + '.pdf';
					// a.download = `开发测试文件` + '.pdf';
					a.href = URL.createObjectURL(blob);
					document.body.appendChild(a);
					a.click();
					document.body.removeChild(a);

					this.loadings = false;
				})
				.catch((err) => {
					console.log(err);
					this.$message({
						showClose: true,
						message: '导出失败',
						type: 'error',
					});
					this.loadings = false;
				});
		},
		exportWordTpl() {

	  
      let converted = htmlDocx.asBlob(this.htmlInit());
      FileSaver.saveAs(converted, `${this.info.ip}数据库运行报告.docx`);
    }
	},
};
</script>
<style>
.dialogBox {
	display: grid;
	grid-template-rows: auto;
	column-gap: 20px;
}
a {
	text-decoration: none;
	color: #909399;
}
.box-card {
	margin: 10px;
}

.a {
	text-indent: 2em;
	font-size: 16px;
	background: #b5b5b5;
	font-weight: 500;
	justify-items: center;
	list-style: none;
	display: inline-block;
	
}
</style>